page.scss 9.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451
  1. .content{
  2. .summary {
  3. font-family: SWISSC;
  4. }
  5. .summary .content{
  6. background: #fff;
  7. border-radius: .04rem;
  8. margin: .1rem 0;
  9. padding: 0 .12rem;
  10. color: grey;
  11. font-size: .1rem;
  12. }
  13. .summary .content .title {
  14. font-family: SWISSC-BT;
  15. font-size: .12rem;
  16. height: .24rem;
  17. line-height: .24rem;
  18. border-bottom: .01rem solid #bdbdbd;
  19. display: -webkit-box;
  20. display: -ms-flexbox;
  21. display: flex;
  22. -webkit-box-pack: justify;
  23. -ms-flex-pack: justify;
  24. justify-content: space-between;
  25. -webkit-box-align: item;
  26. -ms-flex-align: item;
  27. align-items: item;
  28. }
  29. .summary .content .title {
  30. overflow: hidden;
  31. text-overflow: ellipsis;
  32. white-space: nowrap;
  33. font-size: .12rem;
  34. font-weight: 600;
  35. }
  36. .summary .content .cardMian {
  37. display: -webkit-box;
  38. display: -ms-flexbox;
  39. display: flex;
  40. -webkit-box-pack: justify;
  41. -ms-flex-pack: justify;
  42. justify-content: space-between;
  43. }
  44. .summary .content .cardMian>div {
  45. width: 100%;
  46. }
  47. .summary .content .cardMian ul {
  48. //display: -webkit-box;
  49. //display: -ms-flexbox;
  50. //display: flex;
  51. //-webkit-box-pack: center;
  52. //-ms-flex-pack: center;
  53. //justify-content: center;
  54. //padding: 0 .07rem;
  55. //width: 100%;
  56. //-webkit-box-sizing: border-box;
  57. //box-sizing: border-box;
  58. }
  59. .summary .content .today li:first-child, .summary .content .total li:first-child {
  60. //width: 70%;
  61. }
  62. .summary .content .cardMian li {
  63. //width: 100%;
  64. //display: -webkit-box;
  65. //display: -ms-flexbox;
  66. //display: flex;
  67. //-webkit-box-pack: center;
  68. //-ms-flex-pack: center;
  69. //justify-content: center;
  70. //-webkit-box-orient: vertical;
  71. //-webkit-box-direction: normal;
  72. //-ms-flex-direction: column;
  73. //flex-direction: column;
  74. //-webkit-box-align: center;
  75. //-ms-flex-align: center;
  76. //align-items: center;
  77. //margin: .08rem 0;
  78. }
  79. .summary .content .num {
  80. font-size: .15rem;
  81. font-family: SWISSC-BT;
  82. color: #383838;
  83. white-space: nowrap;
  84. font-weight: 600;
  85. }
  86. .summary .content .cardMian .vip {
  87. width: .94rem;
  88. min-width: .94rem;
  89. height: .9rem;
  90. background: #f5f5f5;
  91. border-radius: .1rem;
  92. margin: .12rem 0 .22rem;
  93. display: -webkit-box;
  94. display: -ms-flexbox;
  95. display: flex;
  96. -webkit-box-orient: vertical;
  97. -webkit-box-direction: normal;
  98. -ms-flex-direction: column;
  99. flex-direction: column;
  100. -webkit-box-align: center;
  101. -ms-flex-align: center;
  102. align-items: center;
  103. -webkit-box-pack: center;
  104. -ms-flex-pack: center;
  105. justify-content: center;
  106. color: #ff9d03;
  107. font-size: .1rem;
  108. }
  109. .summary .content .cardMian .vip .level {
  110. font-size: .15rem;
  111. position: relative;
  112. width: .5rem;
  113. height: .5rem;
  114. margin-bottom: .06rem;
  115. }
  116. .summary .content .cardMian .vip .level .levelNum {
  117. color: #fff;
  118. margin-top: .05rem;
  119. }
  120. .summary .content .cardMian .vip .level span {
  121. position: absolute;
  122. top: 50%;
  123. left: 50%;
  124. -webkit-transform: translate(-50%, -50%);
  125. -ms-transform: translate(-50%, -50%);
  126. transform: translate(-50%, -50%);
  127. }
  128. .summary .content .commission {
  129. margin-top: .1rem;
  130. }
  131. .summary .content .wallet {
  132. display: -webkit-box;
  133. display: -ms-flexbox;
  134. display: flex;
  135. -webkit-box-orient: vertical;
  136. -webkit-box-direction: normal;
  137. -ms-flex-direction: column;
  138. flex-direction: column;
  139. -webkit-box-align: center;
  140. -ms-flex-align: center;
  141. align-items: center;
  142. text-align: right;
  143. padding-right: .06rem;
  144. }
  145. .summary .content .wallet .btn {
  146. display: inline-block;
  147. color: #8a8a8a;
  148. height: .24rem;
  149. line-height: .24rem;
  150. font-size: .12rem;
  151. border: .01rem solid #9e9e9e;
  152. padding: 0 .06rem;
  153. border-radius: .03rem;
  154. text-align: center;
  155. margin-top: .08rem;
  156. cursor: pointer;
  157. }
  158. .btn-disable {
  159. background: #e8e8e8;
  160. border: .01rem solid #e8e8e8;
  161. cursor: default;
  162. }
  163. .summary .content .wallet .tip {
  164. font-size: .11rem;
  165. color: #383838;
  166. padding: .04rem 0 .1rem;
  167. }
  168. .summary .shareMain {
  169. padding-bottom: .04rem;
  170. }
  171. .summary .shareMain .title {
  172. font-size: .12rem;
  173. border: none;
  174. padding-top: .06rem;
  175. }
  176. .summary .share {
  177. display: flex;
  178. margin-top: .08rem;
  179. }
  180. .sharePlatform {
  181. margin: .11rem 0;
  182. width: 100%;
  183. display: grid;
  184. grid-template-columns: repeat(5, 1fr);
  185. justify-content: center;
  186. text-align: center;
  187. }
  188. .sharePlatform li{
  189. display: flex;
  190. flex-direction: column;
  191. align-items: center;
  192. font-size: .1rem;
  193. color: #727272;
  194. }
  195. .summary .shareLink {
  196. color: #383838;
  197. font-size: .14rem;
  198. margin-top: .1rem;
  199. }
  200. .copyUrl {
  201. position: relative;
  202. height: .28rem;
  203. border-radius: .03rem;
  204. padding: 0 .08rem 0 .11rem;
  205. -webkit-box-sizing: border-box;
  206. box-sizing: border-box;
  207. font-size: .1rem;
  208. color: grey;
  209. background-color: #f9f9f9;
  210. font-weight: 700;
  211. display: -webkit-box;
  212. display: -ms-flexbox;
  213. display: flex;
  214. -webkit-box-pack: justify;
  215. -ms-flex-pack: justify;
  216. justify-content: space-between;
  217. -webkit-box-align: center;
  218. -ms-flex-align: center;
  219. align-items: center;
  220. margin-bottom: .19rem;
  221. }
  222. summary .shareLink .copyUrl {
  223. margin-top: .08rem;
  224. }
  225. .copyUrl .url {
  226. width: 2.4rem;
  227. -webkit-user-select: text;
  228. -moz-user-select: text;
  229. -ms-user-select: text;
  230. user-select: text;
  231. }
  232. .omitWrap {
  233. overflow: hidden;
  234. -o-text-overflow: ellipsis;
  235. text-overflow: ellipsis;
  236. white-space: nowrap;
  237. }
  238. .copyUrl #copy {
  239. position: absolute;
  240. display: inline-block;
  241. width: .77rem;
  242. height: .28rem;
  243. line-height: .28rem;
  244. text-align: center;
  245. border-radius: .03rem;
  246. color: #40a1de;
  247. right: 0;
  248. cursor: default;
  249. }
  250. .sharePlatform img {
  251. width: .4rem;
  252. }
  253. img {
  254. border: none;
  255. vertical-align: middle;
  256. }
  257. .summary .tel-box2, .summary .tel-box {
  258. display: -webkit-box;
  259. display: -ms-flexbox;
  260. display: flex;
  261. margin-top: .1rem;
  262. -webkit-box-align: center;
  263. -ms-flex-align: center;
  264. align-items: center;
  265. }
  266. .summary .hintTitle2, .summary .hintTitle3 {
  267. font-size: .12rem;
  268. color: #442729;
  269. line-height: .18rem;
  270. margin: .01rem auto;
  271. }
  272. .summary .hintTitle2 {
  273. padding-bottom: .1rem;
  274. }
  275. .summary .telicon {
  276. width: .5rem;
  277. height: .5rem;
  278. margin-right: .1rem;
  279. flex-shrink: 0;
  280. }
  281. a, a:hover, a:link, a:visited, a:active {
  282. text-decoration: none;
  283. }
  284. .summary .telicon img {
  285. width: .5rem;
  286. height: .5rem;
  287. }
  288. .summary .hint {
  289. padding-bottom: .3rem;
  290. }
  291. .summary .hintTitle {
  292. font-size: .14rem;
  293. color: #442729;
  294. line-height: .18rem;
  295. font-family: SWISSC-BT;
  296. text-align: center;
  297. margin: .09rem auto;
  298. }
  299. .imgContent {
  300. color: red;
  301. font-size: .13rem;
  302. line-height: .19rem;
  303. padding: .04rem 0 .15rem;
  304. position: relative;
  305. display: grid;
  306. grid-template-columns: .67rem 1fr .7rem;
  307. align-items: center;
  308. }
  309. .van-slider {
  310. position: relative;
  311. width: 100%;
  312. height: 2px;
  313. background-color: #ebedf0;
  314. border-radius: 999px;
  315. cursor: pointer;
  316. }
  317. .van-slider__bar {
  318. position: relative;
  319. width: 100%;
  320. height: 100%;
  321. background-color: #1989fa;
  322. border-radius: inherit;
  323. -webkit-transition: all .2s;
  324. transition: all .2s;
  325. }
  326. .van-slider__button-wrapper, .van-slider__button-wrapper-right {
  327. position: absolute;
  328. top: 50%;
  329. right: 0;
  330. -webkit-transform: translate3d(50%, -50%, 0);
  331. transform: translate3d(50%, -50%, 0);
  332. cursor: grab;
  333. }
  334. .imgContent .slider .img {
  335. background: url('/img/huakuai.png') 50% no-repeat;
  336. height: .16rem;
  337. width: .16rem;
  338. background-size: auto 100%;
  339. }
  340. .groupTitle {
  341. font-size: .14rem;
  342. font-family: SWISSC-BT;
  343. text-align: center;
  344. margin: .04rem 0;
  345. color: #442729;
  346. font-weight: 700;
  347. }
  348. ul.rules {
  349. display: list-item;
  350. color: #383838;
  351. font-size: .12rem;
  352. line-height: .14rem;
  353. padding-left: .18rem;
  354. }
  355. ul.rules li {
  356. display: list-item !important;
  357. list-style: decimal;
  358. margin-top: .12rem !important;
  359. }
  360. .headerBack .iconfont {
  361. font-size: .24rem;
  362. color: #fff;
  363. width: .4rem;
  364. cursor: pointer;
  365. }
  366. .headerBack .right .icon-company_nav_icon_home{
  367. display: inline-block;
  368. font-size: .24rem;
  369. color: #fff;
  370. }
  371. .summary .content .title .icon-bangzhu {
  372. font-size: .14rem;
  373. color: #40dba9;
  374. margin-left: .04rem;
  375. cursor: pointer;
  376. }
  377. .summary .content .cardMian .vip .level .icon-vip {
  378. color: #ff6a01;
  379. font-size: .5rem;
  380. }
  381. .summary .content .cardMian .vip .iconfont {
  382. color: #40dba9;
  383. font-size: .1rem;
  384. }
  385. .summary .content .wallet .tip .icon-tishi1 {
  386. font-size: .12rem;
  387. margin-right: .02rem;
  388. color: #009d80;
  389. }
  390. .summary .hintTitle2 .iconfont {
  391. font-size: .06rem;
  392. color: #a6a6a6;
  393. margin-right: .1rem;
  394. }
  395. .tabs .van-tabs__line{
  396. width: .3rem;
  397. height: .01rem;
  398. background: -webkit-gradient(linear, left top, left bottom, from(#ff9323), to(#ff6a01));
  399. background: -webkit-linear-gradient(top, #ff9323, #ff6a01);
  400. background: -o-linear-gradient(top, #ff9323, #ff6a01);
  401. background: linear-gradient(180deg, #ff9323, #ff6a01);
  402. bottom: .22rem;
  403. transform: translateX(40px) translateX(-50%);
  404. transition-duration: 0.3s;
  405. }
  406. .van-tabs__line {
  407. position: absolute;
  408. bottom: 15px;
  409. left: 0;
  410. z-index: 1;
  411. width: 40px;
  412. height: 3px;
  413. background-color: #ee0a24;
  414. border-radius: 3px;
  415. }
  416. .van-tabs__wrap--scrollable .van-tab {
  417. -webkit-box-flex: 1;
  418. -webkit-flex: 1 0 auto;
  419. flex: 1 0 auto;
  420. padding: 0 12px;
  421. }
  422. .van-tabs__nav {
  423. position: relative;
  424. display: -webkit-box;
  425. display: -webkit-flex;
  426. display: flex;
  427. background-color: #fff;
  428. -webkit-user-select: none;
  429. user-select: none;
  430. }
  431. }
  432. .statistics-card{
  433. width: 100%;
  434. display: flex;
  435. margin: 0.08rem 0;
  436. justify-content: space-between;
  437. text-align: center;
  438. }
  439. .commission{
  440. margin: 0.08rem 0;
  441. display: grid;
  442. grid-template-columns: 1fr 1fr;
  443. text-align: center;
  444. }